<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>正则基本语法示例</title>
    <style>
        section {
            padding: 10px;
        }

        table {
            border-collapse: collapse;
        }

        td {
            border: 1px solid rgba(0, 0, 0, 0.2);
            padding: 10px 20px;
        }

        code {
            font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
            color: #c90b33;
            background-color: rgba(27,31,35,0.05);
            padding: 3px 5px;
        }
    </style>
</head>
<body>
    <h1>正则基本语法示例</h1>
    <section>
        <h2>简化的电子邮件规则</h2>
        <ul>
            <li>@</li>
            <li>@ 后面，数字、字幕、下划线、点、横线</li>
            <li>@ 前面，数字、字幕、下划线、点、横线</li>
        </ul>
    </section>
    <section>
        <h2>基本语法</h2>
        <table>
            <tr>
                <td><code>[xyz]</code></td>
                <td>一个字符集，匹配任意一个包含的字符</td>
                <td><code>[^xyz]</code></td>
                <td>一个否定字符集，匹配任何未包含的字符</td>
            </tr>
            <tr>
                <td><code>\w</code></td>
                <td>匹配字母或数字或者下划线的字符</td>
                <td><code>\W</code></td>
                <td>匹配不是字母，数字，下划线的字符</td>
            </tr>
            <tr>
                <td><code>\s</code></td>
                <td>匹配任意空白符</td>
                <td><code>\S</code></td>
                <td>匹配不是空白符的字符</td>
            </tr>
            <tr>
                <td><code>\d</code></td>
                <td>匹配数字</td>
                <td><code>\D</code></td>
                <td>匹配非数字的字符</td>
            </tr>
            <tr>
                <td><code>\b</code></td>
                <td>匹配单词的开始或结束的位置</td>
                <td><code>\B</code></td>
                <td>匹配不是单词开头或结束的位置</td>
            </tr>
            <tr>
                <td><code>$</code></td>
                <td>匹配字符串的开始</td>
                <td><code>^</code></td>
                <td>匹配字符串的结束</td>
            </tr>
        </table>
    </section>
</body>
</html>